<ui:component xmlns="http://www.w3.org/1999/xhtml"  
     xmlns:f="http://java.sun.com/jsf/core"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:p="http://primefaces.prime.com.tr/ui"> 
    
 <h:form id="form">  
 
<p:panel header="Cadastro de Visitante" >
 
     <p:wizard widgetVar="wiz"  backLabel="Anterior" nextLabel="Próximo" 
             flowListener="#{visitanteBean.onFlowProcess}">  
       
         <p:tab id="pessoal" title="Pessoal">  
   
             <p:panel >  
                  <h:messages errorClass="error" style="color: red"/>
                                    
                 <h:panelGrid columns="2" columnClasses="label, value" styleClass="grid">  
                    
                     <h:outputText for="nome" value="Nome:"/>  
                     <p:inputText 
                     	id="nome" 
                     	required="true" 
                     	label="Nome" 
                     	size="50" 
                        value="#{visitanteBean.visitante.nome}" />  
                             
                     <h:outputLabel for="dataNascimento" value="Data de Nascimento:" />
           			<p:calendar id="dataNascimento" 
           				value="#{visitanteBean.visitante.dataNascimento}" 
           				mode="popup" showOn="button" 
           				locale="pt_BR"
           				label="Data de Nascimento"
           				autocomplete="true"
           				size="10"
           				effect="drop"
           				pattern="dd/MM/yyyy" 
           				navigator="true"
           				required="true"
           				converter="primefacesCalendarConverter"/>

             
			<h:outputLabel for="sexo" value="Sexo:" />
			<p:selectOneRadio id="sexo" value="#{visitanteBean.visitante.sexo}" required="true">
				<f:selectItems value="#{visitanteBean.visitante.sexos}" />  
   			</p:selectOneRadio>
             
			
			<h:outputLabel for="cpf" value="Número do CPF:" />
          	 <p:inputMask 
          	 	id="cpf" 
          	 	value="#{visitanteBean.visitante.cpf}" 
          	 	label="CPF" 
          	 	size="15"
          	 	required="true" 
          	 	mask="999.999.999-99"/>


			<h:outputLabel for="escolaridade" value="Escolaridade:" />
          	 <p:selectOneMenu id="escolaridade" effect="drop" value="#{visitanteBean.visitante.escolaridade}" >
          	 	<f:selectItem itemLabel="Ensino Médio Completo"  itemValue="Ensino Médio Completo"/>
          	 	<f:selectItem itemLabel="Superior Incompleto"  itemValue="Superior Incompleto"/>
          	 	<f:selectItem itemLabel="Superior Completo"  itemValue="Superior Completo"/>
          	 	<f:selectItem itemLabel="Outro"  itemValue="Outro"/>
          	 </p:selectOneMenu>
          	 
          	 <h:outputText for="naturalidade" value="Naturalidade:"/>  
                     <p:inputText 
                     	id="naturalidade" 
                     	label="Naturalidade" 
                     	size="30" 
                        value="#{visitanteBean.visitante.naturalidade}" />  
              
            <h:outputText for="motivo" value="Motivo:"/>
            <p:inputTextarea style="width:500px;height:100px;" effectDuration="400"
                     	id="motivo" 
                     	required="true" 
                     	label="Motivo" 
                        value="#{visitanteBean.visitante.motivo}" />           
                 </h:panelGrid>  
            </p:panel>  
         </p:tab>  
       
         <p:tab id="endereco" title="Endereço">  
             <p:panel>  
                   
                 <h:messages errorClass="error" style="color: red"/>  
               
                 <h:panelGrid columns="2" columnClasses="label, value">  
                 
                 <h:outputText value="Logradouro:" />  
                     <p:inputText
                     	required="true" 
                     	label="Logradouro" 
                     	size="30" 
                     	value="#{visitanteBean.endereco.logradouro}" /> 
                   
                   <h:outputText for="numero" value="Número:" /> 
                   <p:inputText id="numero" 
                   value="#{visitanteBean.endereco.numero}" 
                   size="6" 
                   label="Número" />
                  
                  <h:outputText for="complemento" value="Complemento:" /> 
                  <p:inputText id="complemento" value="#{visitanteBean.endereco.complemento}" size="60" label="Complemento" />
                  
                  <h:outputText value="Bairro:" />  
                     <p:inputText
                     	required="true" 
                     	label="Bairro" 
                     	size="20" 
                     	value="#{visitanteBean.endereco.bairro}" /> 
                  
                  <h:outputText value="Município:" />  
                     <p:inputText
                     	required="true" 
                     	label="Cidade" 
                     	size="20" 
                     	value="#{visitanteBean.endereco.municipio}" /> 
                     	
               
                  <h:outputText value="CEP:" />  
                     <p:inputMask
                     	required="true" 
                     	label="CEP" 
                     	size="9" 
                     	mask="99.999-999"
                     	value="#{visitanteBean.endereco.cep}" />       
                    
                    <h:outputText for="uf" value="UF:" /> 
                   <p:inputText id="uf" value="#{visitanteBean.endereco.uf}" size="2" label="UF" />
                
                 </h:panelGrid>  
             </p:panel>  
         </p:tab> 
       
         <p:tab id="contato" title="Contato">  
             <p:panel>  
                   
                 <h:messages errorClass="error" style="color: red"/>  
               
                 <h:panelGrid columns="2" columnClasses="label, value">  
                 
                 <h:outputText value="Fixo:" />  
                     <p:inputMask
                     	label="Fixo" 
                     	size="12" 
                     	mask="(99)9999-9999"
                        value="#{visitanteBean.telefone.numeroFixo}" /> 
                        
                  <h:outputText value="Celular:" />  
                     <p:inputMask
                     	label="Celular" 
                     	size="12" 
                     	mask="(99)9999-9999"
                        value="#{visitanteBean.telefone.numeroCelular}" /> 
                              
                     <h:outputText value="Email:" />  
                     <p:inputText 
                     	required="true" 
                     	label="Email" 
                     	size="40" 
                        value="#{visitanteBean.visitante.email}" />  
                       
                 </h:panelGrid>  
             </p:panel>  
         </p:tab>  
         
         <p:tab id="user" title="Usuário">  
             <p:panel >  
               
                 <h:messages errorClass="error" style="color: red"/>  
                   
                 <h:panelGrid columns="2" columnClasses="label, value"> 
                  
                    <h:outputLabel for="login" value="Login:" />
           			<p:inputText 
           					id="login" 
           					value="#{visitanteBean.visitante.login}"
           					size="12" 
           					label="Login" 
           					required="true"/>
           
           			<h:outputLabel for="senha" value="Senha:" />         
          			<p:password 
          				id="senha" 
          				value="#{visitanteBean.visitante.senha}"  
          				label="Senha" 
          				size="12"
          				required="true"
          				promptLabel="Digite sua senha"
          				weakLabel="Fraca"
          				goodLabel="Forte"
          				strongLabel="Muito Forte"/>
    				
                 </h:panelGrid>  
             </p:panel>  
         </p:tab>  
         
     <p:tab id="confirma" title="Confirmar">  
        
             
             <center>
             
             <p:panel >  
                <p:growl id="growl" life="3000" sticky="true" showDetail="true"/> 
               				
                <p:separator/>  
                <p:separator>Pessoal</p:separator>
                 <h:panelGrid id="confirmacaoPessoal" columns="2">  
                 
                     <h:outputText value="Nome: " />  
                     <h:outputText styleClass="outputLabel"  
                                 value="#{visitanteBean.visitante.nome}" />  
                             
                     <h:outputText value="Data de Nascimento: " />  
                     <h:outputText styleClass="outputLabel"  
                                 value="#{visitanteBean.visitante.dataNascimento.time}" >  
                          <f:convertDateTime 
                          	pattern="dd/MM/yyyy"
    						 />
                      </h:outputText>  
                      
                     <h:outputText value="Sexo: " />  
                     <h:outputText styleClass="outputLabel"  
                                 value="#{visitanteBean.visitante.sexo}" /> 
                       
                        
                     <h:outputText value="CPF: " />  
                     <h:outputText styleClass="outputLabel"  
                                 value="#{visitanteBean.visitante.cpf}" />  
                       
                      <h:outputText value="Escolaridade: " />  
                     <h:outputText styleClass="outputLabel"  
                                 value="#{visitanteBean.visitante.escolaridade}" />  
                 </h:panelGrid>  
                 <p:separator/>  
                    <p:separator>Endereço</p:separator>
                  <h:panelGrid id="confirmacaoEndereco" columns="2">  
                 
                    <h:outputText value="Logradouro: " />  
                     <h:outputText styleClass="outputLabel"  
                                 value="#{visitanteBean.endereco.logradouro}" />  
                     
					<h:outputText value="Número: " />  
                     <h:outputText styleClass="outputLabel"  
                                 value="#{visitanteBean.endereco.numero}" /> 
                                            
                     <h:outputText value="Complemento: " />  
                     <h:outputText styleClass="outputLabel"  
                                 value="#{visitanteBean.endereco.complemento}" /> 
                                                        
                      <h:outputText value="Bairro: " />  
                     <h:outputText styleClass="outputLabel"  
                                 value="#{visitanteBean.endereco.bairro}" />  
                                 
                     <h:outputText value="Município: " />  
                     <h:outputText styleClass="outputLabel"  
                                 value="#{visitanteBean.endereco.municipio}" />  
                      
                      
                     <h:outputText value="UF: " />  
                     <h:outputText styleClass="outputLabel"  
                                 value="#{visitanteBean.endereco.uf}" /> 
                    
                     <h:outputText value="CEP: " />  
                     <h:outputText styleClass="outputLabel"  
                                 value="#{visitanteBean.endereco.cep}" /> 
        
                 </h:panelGrid> 
                 <p:separator/>  
                     <p:separator>Usuário/Contato</p:separator>
                 <h:panelGrid id="confirmacaoContato" columns="2"> 
                 <h:outputText value="Usuário: " />  
                     <h:outputText styleClass="outputLabel"  
                                 value="#{visitanteBean.visitante.login}" />  
                       
                     <h:outputText value="Email: " />  
                     <h:outputText styleClass="outputLabel"  
                                 value="#{visitanteBean.visitante.email}" />  
                     
                     <h:outputText value="Fixo: " />  
                     <h:outputText styleClass="outputLabel"  
                                 value="#{visitanteBean.telefone.numeroFixo}" /> 
                                 
                      <h:outputText value="Celular: " />  
                     <h:outputText styleClass="outputLabel"  
                                 value="#{visitanteBean.telefone.numeroCelular}" /> 
                                 
                 </h:panelGrid> 
                  <p:separator/>  
                 <p:commandButton value="Confirmar" update="growl"   
                             actionListener="#{visitanteBean.cadastrarVisitante}" />  
               
             </p:panel>  
             </center>
         </p:tab>  
           
     </p:wizard>  
      
          
     <p:ajaxStatus>  
         <f:facet name="start">  
             <h:graphicImage value="/resources/images/ajaxloading.gif" />  
         </f:facet>  
           
         <f:facet name="complete">  
             <h:outputText value="" />  
         </f:facet>  
     </p:ajaxStatus>  

</p:panel>
	 </h:form>  
<p:messages id="messages"/>
</ui:component>
